<template>
  <div>
    <div><button @click="addAddfn">修改价格和汽车（存在问题）</button></div>
    <div>一辆汽车{{ car.brand }}车，价格{{ car.price }}</div>
  </div>
</template>
<script setup lang="ts"  name= "person555">
import { reactive, ref } from "vue";
let arr = ref({ brand: "奔驰", price: 100 });
let car = reactive({ brand: "奔驰", price: 100 });
console.log("响应式", car);
function addAddfn() {
  // car = { brand: "比亚迪", price: 10 }; //整个替换对象 修改有问题呀页面不跟更新
  // car =reactive { brand: "比亚迪", price: 10 }; //整个替换对象 修改有问题呀页面不跟更新   这是大忌reactive和ref不能写在函数里面
  // arr =ref { brand: "比亚迪", price: 10 }; //整个替换对象 修改有问题呀页面不跟更新   这是大忌reactive和ref不能写在函数里面
  Object.assign(car, { brand: "比亚迪", price: 10 }); //在reactive  解决问题
  // car.value = { brand: "比亚迪", price: 10 };     //-ref定义的对象整体替换应该.valuevalue
}
</script>